<html>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
    $(document).ready(function () {
        //前缀搜索
        var flag = true;
        $('#input_id').on('compositionstart', function () {
            flag = false;
        })

        $('#input_id').on('compositionend', function () {
            flag = true;
        })

        $('#input_id').on('input', function () {
            var _this = this;
            setTimeout(function () {
                if (!flag) {
                    return
                }

                keyword = $(_this).val()
                if (keyword.length == 0) {
                    return
                }

                $.getJSON("http://localhost:8080/school/prefixsearch?keyword=" + keyword, function (result) {
                    if (result.code != 0) {
                        return
                    }
                    $("#suggest_id option").remove();
                    $.each(result.data, function (key, val) {
                        $('#suggest_id').append("<option value='" + val.Goods_name + "'>");
                    });


                });
            }, 0)
        })



        //敏感词
        $('#output_id').on('compositionstart', function () {
            flag = false;
        })

        $('#output_id').on('compositionend', function () {
            flag = true;
        })

        $("#output_id").mouseleave(function(){
            var _this = this;
            setTimeout(function () {
                if (!flag) {
                    return
                }

                keyword = $(_this).val()
                if (keyword.length == 0) {
                    return
                }

                $.getJSON("http://localhost:8080/school/search?keyword=" + keyword, function (result) {
                    if (result.code != 0) {
                        return
                    }

                    if (result.data ==true) {
                        alert('注意文明用语!');
                    }else{
                        alert('字符串不存在!');
                    }

                });

            }, 0)
        });

    });
</script>
<body>
<div>
    <span> 请输入商品名称:</span>
    <input id="input_id" type="text" name="keyword" list="suggest_id"></input>
    <datalist id="suggest_id">
    </datalist>
</div>

<div>
    <span> 请输入敏感词:</span>
    <input id="output_id" type="text" name="keyword" list="suggest_id"></input>
    <datalist id="suggest_id">
    </datalist>
</div>
</body>
</html>
